<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>成绩信息录入</title>
    <link rel="stylesheet" href="../css/score_enter.css"></link>
</head>
<body>
    <div class="container">
        <h2 style="text-align: center; color: green;">成绩信息录入</h2>
        
        <div class="search-box">
            <label for="course">课程名：</label>
            <select id="course">
                <option value="">请选择</option>
                <option value="计算机基础">计算机基础</option>
                <option value="程序设计与语言">程序设计与语言</option>
                <option value="离散数学">离散数学</option>
                <option value="数据结构">数据结构</option>
                <option value="操作系统">操作系统</option>
                <option value="计算机网络">计算机网络</option>
                <option value="软件工程">软件工程</option>
                <option value="计算机原理">计算机原理</option>
                <option value="数据库原理">数据库原理</option>
            </select>
            
            <label for="major">专业：</label>
            <select id="major">
                <option value="">请选择</option>
                <option value="计算机">计算机</option>
                <option value="软件工程">软件工程</option>
                <option value="网络工程">通信工程</option>
            </select>
            
            <button id="query-btn">查询</button>
        </div>

        <div style="overflow-x: auto;">
            <table id="score-table">
                <thead>
                    <tr>
                        <th>学号</th>
                        <th>姓名</th>
                        <th>成绩</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <!-- 数据将通过 JavaScript 动态填充 -->
                </tbody>
            </table>
        </div>

        <div class="pagination">
            <div id="pagination-controls">
                <span>第 1 页，共 1 页</span>
            </div>
            <div class="page-size-selector">
                <label for="page-size">每页显示：</label>
                <select id="page-size">
                    <option value="5">5</option>
                    <option value="10" selected>10</option>
                    <option value="20">20</option>
                    <option value="50">50</option>
                </select>
                <span>条</span>
            </div>
        </div>
    </div>

    <script src="../js/score_enter.js" type="module"></script>
</body>
</html>